window.onload = function(){
	class_game._init();
}

//键盘按下时触发的事件
document.onkeydown = function(event){
	var _left = 37,_up=38,_right=39,_down=40;//键位值
	var event = event || window.event;
	var _key_value = event.which || event.keyCode;

	//蛇的移动方向规律
	switch(_key_value){
		case _left:
			if(class_game._direction != 'right'){
				class_game._direction = 'left';
			}
			break;
		case _up:
			if(class_game._direction != 'down'){
				class_game._direction = 'up';
			}
			break;
		case _right:
			if(class_game._direction != 'left'){
				class_game._direction = 'right';
			}
			break;
		case _down:
			if(class_game._direction != 'up'){
				class_game._direction = 'down';
			}
			break;
	}
}

function in_array(string, array){
	for(var i = 0; i < array.length; i++){
		if(array[i] == string){
			return true;
		}
	}
	return false;
}


var class_game = {
	_row:10, //行
	_column:20, //列
	_box_width:50, //格子宽高
	_box_height:50,
	_map:[], //地图
	_snake:[], //蛇
	_snake_x:null,
	_snake_y:null,
	_food_x:null,
	_food_y:null,
	_direction:null, //方向

	_init:function(){
		this._draw();//绘制画布,蛇,食物
		this._move();//移动
	},

	_draw:function(){
		for (var x = 0; x < this._column; x++) {
			this._map[x] = [];
			for (var y = 0; y < this._row; y++) {
				this._map[x][y] = 0; // 0:默认 1:蛇 2:食物
			}
		}
		this._randoms();//生成蛇和食物的坐标

		this._map[this._snake_x][this._snake_y] = 1;
		this._map[this._food_x][this._food_y] = 2;

		//生成画布
		for(var x=0;x<this._column;x++){
			for(var y=0;y<this._row;y++){
				var _div = class_base._create('div');

				if(this._map[x][y] == 1){
					this._snake[0] = y*this._column+x;
					_div.setAttribute('class', 'snake');
				}else if(this._map[x][y] == 2){
					_div.setAttribute('class', 'food');
				}else{
					_div.setAttribute('class', 'box');
				}
				_div.setAttribute('id',y*this._column+x);
				_div.setAttribute('style','width:'+this._box_width+'px;height:'+this._box_height+'px;top:'+this._box_height*y+'px;left:'+this._box_width*x+'px;');
				
				//y*列数+x
				_div.innerHTML = y*this._column+x+'<br>'+'['+x+','+y+']';
				class_base._get('game_panel').appendChild(_div);
			}
		}
	},

	_randoms:function(){
		this._snake_x = Math.floor(Math.random()*this._column); 
		this._snake_y = Math.floor(Math.random()*this._row);

		this._food_x = Math.floor(Math.random()*this._column);
		this._food_y = Math.floor(Math.random()*this._row);
		if(this._snake_x == this._food_x && this._snake_y == this._food_y){
			this._randoms();
		}
	},

	_move:function(){
		//移动
		var _init_position = this._snake[0];
		var _start_position = this._snake[0]; //起始位置

		switch(this._direction) {//按下方向键以后的开始位置
		     case 'left':
		        _start_position = this._snake[0]-1;
		        break;
		     case 'up':
		     	_start_position = this._snake[0]-this._column;
		        break;
		     case 'right':
		     	_start_position = this._snake[0]+1;
		        break;
		     case 'down':
		     	_start_position = this._snake[0]+this._column;
		        break;
		}
		//边界判断
		if((this._direction == 'right' && _start_position%this._column==0) || (this._direction == 'left' && (_start_position+1)%this._column==0) || (_start_position<0 || _start_position>this._column*this._row)){
			alert('游戏结束');
			return false;
		}

		if(_init_position != _start_position && in_array(_start_position, this._snake)){
			alert('游戏结束');
			return false;
		}


		this._snake.unshift(_start_position); //向数组的开头添加元素
		
		var _food_position = this._food_y*this._column+this._food_x; //食物的位置
		
		if(_food_position == _start_position){
			//蛇和食物位置重叠 重新生成食物
			
			this._food_x = Math.floor(Math.random()*this._column);
			this._food_y = Math.floor(Math.random()*this._row);

			class_base._get(this._food_y*this._column+this._food_x).setAttribute('class', 'food');

		}else{
			var _end_position = this._snake.pop(); //删除并返回数组的最后一个元素
			//重绘画布
			if(_end_position != this._snake[0]){
				class_base._get(_end_position).setAttribute('class', 'box');
			}
		}

		//重绘蛇
		for (var i = 0; i < this._snake.length; i++) {
			class_base._get(this._snake[i]).setAttribute('class', 'snake');
		}
		
		setTimeout(function(){class_game._move()},500);
	}

}

var class_base = {
	_get:function(_id){
		return document.getElementById(_id);
	},
	_create:function(_element){
		return document.createElement(_element);
	}
}